<template>
	<view>
		<view class="title">
			<text>请选择你需要验收的项目属于什么类型</text>
			<checkboxType ref="checkbox" @change="valueChange"></checkboxType>
		</view>
		
		<view class="title">
			<text>请上传装修后图片</text>
		</view>
		<uploadImg :upload_auto="true" @getImgList="getImgList" @removeImage="removeImage" ref="upImg" :upimg_preview="serviceArr"></uploadImg>
		<view class="fromSubmit">
			<view class="from-item">
				<view class="item-title">
					<text class="from-item-title">备注</text>
				</view>
				<textarea class="from-item-textarea" maxlength="240" v-model="formSubmit.remark" placeholder="请输入备注" />
			</view>
			<button type="warn" class="from-button" @click="submit">提交 /Submit</button>
		</view>
	</view>
</template>

<script>
import uploadImg from '@/components/uploadImg/uploadImg.vue'
import checkboxType from '@/components/checkbox-type/checkbox-type.vue'

export default {
	components: {
		uploadImg,
		checkboxType
	},
	data() {
		return {
			formSubmit: {
				remark: ''
			},
			serviceArr: [
				// {
				// 	path: 'https://dss0.bdstatic.coeca3'
				// }
			],
			imgList: ''
		}
	},
	onLoad(option) {
		this._houseInfoId = option.houseInfoId
		this._houseOwnerId = option.houseOwnerId
	},
	mounted() {
		this.setTypeCode()
	},
	methods: {
		setTypeCode() {
			let userid = uni.getStorageSync('userInfo').typeLevel
			userid = userid.split(',')
			let list = []
			userid.map(i => {
				if (i == 7) {
					list.push({ text: '瓦工', value: 7 })
				}
				if (i == 8) {
					list.push({ text: '木工', value: 8 })
				}
				if (i == 9) {
					list.push({ text: '水电工', value: 9 })
				}
				if (i == 10) {
					list.push({ text: '油漆工', value: 10 })
				}
			})
			/* 设置 单选框 */
			this.$refs.checkbox.set({
				type: 'radio', // 类型：单选框
				index: 0, // 默认选中的项
				column: 3, // 分列
				list
			})
		},
		submit() {
			const params = {
				workerAccountId: uni.getStorageSync('userInfo').id,
				houseInfoId: this._houseInfoId,
				houseOwnerId: this._houseOwnerId,
				typeLevel: this.$refs.checkbox.get().value,
				acceptancePhoto: this.imgList,
				remark: this.formSubmit.remark,
			}
			this.$api.addAcceptanceInfo(params)
				.then(res => {
					if (res.success) {
						uni.showToast({
						  icon: 'success',
						  title: '提交成功'
						});
						setTimeout(() => {
						  uni.navigateBack({
								delta: 1
							})
						}, 500)
					} else {
						uni.showToast({ title: res.msg, icon: 'none' })
					}
				})
				.catch(err => {
					console.log('request fail', err)
				})
		},
		getImgList(item) {
			this.imgList += item + ','
		},
		removeImage(index) {
			let removeList = this.imgList.split(',')
			removeList.splice(index, 1)
			removeList = removeList.join()
			this.imgList = removeList
		}
	}
}
</script>

<style lang="scss" scoped>
.title {
	padding: 30rpx 30rpx 0 30rpx;
	font-size: 32rpx;
}
.fromSubmit {
	padding: 40rpx;
	.from-item {
		margin-bottom: 40rpx;
		.item-title {
			margin-bottom: 20rpx;
			.from-item-title {
				font-size: 32rpx;
				font-weight: 500;
				color: #333333;
				margin-right: 20rpx;
			}
		}
		.uni-input {
			background: #f6f6f6;
			border-radius: 4px;
		}
		.from-item-textarea {
			background: #f6f6f6;
			width: 100%;
			border-radius: 4px;
		}
	}
	.from-button {
		background: $uni-color-base;
	}
}
</style>
